<template>
	<view class="jilu">
		<view class="j1">
			<text>入场时间：</text>
			<input type="text" placeholder="2021-04-11" v-model="one"/>
		</view>
		<u-line></u-line>
		<view class="j1">
			<text>出场时间：</text>
			<input type="text" placeholder="2021-04-11" v-model="two"/>
		</view>
		<u-line></u-line>
		<u-button type="primary" text="查询" @click="search"></u-button>
		<view class="j2" v-for="item in list" :key="item.id">
			<text>{{item.parkName}}</text>
			<text>车牌号：{{item.plateNumber}}</text>
			<text>收费金额：{{item.monetary}}元</text>
			<text>入场时间：{{item.entryTime}}</text>
			<text>出场时间：{{item.outTime}}</text>
		</view>
		<u-button type="primary" text="查看更多" @click="getmore()" v-show="key"></u-button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
				alllist:[],
				one:'',
				two:'',
				key:true
			}
		},
		onLoad() {
			this.getlist()
			this.getli()
		},
		methods: {
			getlist(){
				this.api.get('/prod-api/api/park/lot/record/list').then(res=>{
					this.alllist=res.data.rows
				})
			},
			getli(){
				this.api.get('/prod-api/api/park/lot/record/list?pageNum=1&pageSize=6').then(res=>{
					this.list=res.data.rows
				})
			},
			getmore(){
				this.key=false
				this.list=this.alllist
			},
			search(){
				this.list=[]
				if(this.one===''&&this.two!==''){
					console.log(1)
					for(let i=0;i<this.alllist.length;i++){
						if(this.alllist[i].outTime.indexOf(this.two)>=0){
							this.list.push(this.alllist[i])
						}
					}
				}else{
					for(let i=0;i<this.alllist.length;i++){
						if(this.alllist[i].entryTime.indexOf(this.one)>=0){
							this.list.push(this.alllist[i])
						}
					}
				}	
				this.key=false
			}
		}
	}
</script>

<style lang="scss">
.j1{
	display: flex;
	margin-top: 13px;
	margin-bottom: 13px;
}
.j2{
	display: flex;
	flex-direction: column;
	text-align: center;
	width: 275px;
	border: 1px solid seagreen;
	margin: 20px auto;
	line-height: 25px;
}
</style>
